<template lang="html">
    <div class="">
        <div class="t_header">
            <el-form :inline="true" label-width="100px" class="demo-form-inline">
              <el-form-item label="供应商姓名">
                <el-input v-model="supplierName" placeholder="供应商姓名"></el-input>
              </el-form-item>
              <el-form-item>
                <el-button type="primary" class="el_button" @click="onSubmit(1)">查询</el-button>
              </el-form-item>
            </el-form>
        </div>

        <div class="body">
            <el-table :data="tableData.list" :span-method="objectSpanMethod" border style="width: 100%; margin-top: 20px">
                <el-table-column prop="sm_name" label="供应商姓名" width="180" align="center"></el-table-column>
                <el-table-column prop="oil_name" label="油品名称" align="center"></el-table-column>
                <el-table-column label="油品图片" width="100" align="center">
                  <template slot-scope="scope">
                     <div class="el-table_img">
                        <img :preview="scope.row.cover" class="preview-img" :src="scope.row.cover" alt="">
                     </div>
                 </template>
                </el-table-column>
                <el-table-column prop="price" label="油品结算价" align="center"></el-table-column>
                <el-table-column prop="about" label="油品详情" align="center"></el-table-column>
                <el-table-column label="质量保证书" width="100" align="center">
                  <template slot-scope="scope">
                     <div class="el-table_img">
                        <img preview="0" class="preview-img" :src="scope.row.quality_certificate" alt="">
                     </div>
                 </template>
                </el-table-column>
                <el-table-column label="质检报告" width="100" align="center">
                  <template slot-scope="scope">
                     <div class="el-table_img">
                        <img preview="0" class="preview-img" :src="scope.row.quality_inspection_report" alt="">
                     </div>
                 </template>
                </el-table-column>
                <el-table-column label="质量承保书" width="100" align="center">
                  <template slot-scope="scope">
                     <div class="el-table_img">
                        <img preview="0" class="preview-img" :src="scope.row.quality_undertaking" alt="">
                     </div>
                 </template>
                </el-table-column>
                <el-table-column prop="" label="操作" align="center">
                  <template slot-scope="scope">
                    <el-button @click="handleClick(scope.row)" type="text" size="small">通过</el-button>
                    <el-button @click="reject(scope.row)" type="text" size="small">驳回</el-button>
                  </template>
                </el-table-column>
            </el-table>
            <el-pagination
              layout="prev, pager, next"
              :page-count="tableData.rows"
               @current-change="changePage" align="center">
            </el-pagination>
        </div>
        <!-- <el-dialog title="通过" :visible.sync="centerVisible" width="30%" center>
           <el-input slot="" type="textarea" :rows="2" placeholder="请输入内容" v-model="textarea"></el-input>
           <span slot="footer" class="dialog-footer">
               <el-button @click="centerVisible = false">取 消</el-button>
               <el-button type="primary" @click="aConfirm">确 定</el-button>
           </span>
        </el-dialog> -->
        <el-dialog title="驳回理由" :visible.sync="centerDialogVisible" width="30%" center>
           <el-input slot="" type="textarea" :rows="2" placeholder="请输入内容" v-model="textarea"></el-input>
           <span slot="footer" class="dialog-footer">
               <el-button @click="centerDialogVisible = false">取 消</el-button>
               <el-button type="primary" @click="rejectConfirm">确 定</el-button>
           </span>
        </el-dialog>
    </div>
</template>

<script>
export default {
    data(){
      return {
        token:this.$store.state.user.token3,
        supplierName:'',
        tableData: [],
        textarea:"",
        messageBoxTip:"设置最低结算额",
        centerDialogVisible:false,
        showInput:false,
        minimum:0,
        currentRow:[]
      }
    },
    created(){
      this.onSubmit(1)
    },
    methods:{
      onSubmit(page = 1){
          this.$http2.smOilUnAuditList({
            sm_name: this.supplierName,
            page: page
          }).then(res=>{
            if(res.data.code == 1){
              this.tableData = res.data.data;
              for(var i=0;i<this.tableData.list.length;i++){
                  for(var j=0;j<this.tableData.list[i].detail.length;j++){
                      this.tableData.list[i].detail[j].sm_id =
                      this.tableData.list[i].sm_id
                      this.tableData.list[i].detail[j].sm_name =
                      this.tableData.list[i].sm_name
                      this.tableData.list[i].detail[j].quality_certificate =
                      this.tableData.list[i].quality_certificate
                      this.tableData.list[i].detail[j].quality_undertaking =
                      this.tableData.list[i].quality_undertaking
                      this.tableData.list[i].detail[j].quality_inspection_report =
                      this.tableData.list[i].quality_inspection_report
                  }
              }
              for(var i=0;i<this.tableData.list.length;i++){
                this.tableData.list[i] = this.tableData.list[i].detail
              }

              this.tableData.list = Array.prototype.concat.apply([],this.tableData.list)

            }else{
              this.tableData = []
            }

          })
      },
      changePage(e){
        this.onSubmit(e)
      },
      handleClick(e){
        this.$http2.getSmMinMoney({
          sm_id:e.sm_id,
          token: this.token
        })
        .then(res=>{
          if(res.data.code == 1){
            this.showInput = true
            this.minimum = res.data.data
            return this.$confirm(this.messageBoxTip,"是否通过",{
              showInput:this.showInput,
              inputValue: this.minimum
            })
          }else{
            this.showInput = false
            this.minimum = 0
            return this.$confirm('',"是否通过",{
              showInput:this.showInput
            })
          }

        })
        .then(({ value })=>{
          return this.$http2.passOil({
            sm_id:e.sm_id,
            min_money: value,
            token:this.token
          })
        })
        .then(res=>{
          if(res.data.code){
            this.$message.success(res.data.msg)
            this.onSubmit()
          }else{
            this.$message.error(res.data.msg)
          }
        }).catch(_=>{})


      },
      reject(e){
        this.currentRow = e;
        this.centerDialogVisible = true;
      },
      rejectConfirm(){
        // console.log(this.currentRow)
        this.$http2.rejectOil({
            sm_id: this.currentRow.sm_id,
            reason: this.textarea
        }).then(res=>{
          if(res.data.code){
            this.$message.success(res.data.msg)
            this.centerDialogVisible = false;
            this.onSubmit()
          }else{
            this.$message.error(res.data.msg)
          }
        })
      },
      objectSpanMethod({ row, column, rowIndex, columnIndex }) {
         if (columnIndex >= 5 ||columnIndex === 0) {
               if (rowIndex % 4 === 0) {
                 return {
                   rowspan: 4,
                   colspan: 1
                 };
               }else {
                  return {
                    rowspan: 0,
                    colspan: 0
                  };
                }
         }
       }

    }
}
</script>

<style lang="css" scoped>
.preview-img{
  display: block;
  width: 100%;
  height: 30px;
}
</style>
